<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>首页</title>
		<link rel="stylesheet" type="text/css" href="jquery.mobile-1.4.5.min.css" />
		<script src="js/jq.js"></script>
		<script src="js/jquery.mobile-1.4.5.min.js"></script>
		<script src="js/vendor/jquery.ui.widget.js"></script>
		<script src="js/jquery.iframe-transport.js"></script>
		<script src="js/jquery.fileupload.js"></script>
		<style>
			html,body{
				height:100%;
			}
			.index{
				color:red !important;
			}
		</style>
	</head>
<body>
<div data-role="page" data-theme="a">

	  <div data-role="header" id="header">
	    <h1>分享LIST</h1>
	  </div>
		

	  <div style="width:15%;background:#e9e9e9;position:absolute;height:95%;top:44px">
	  		<ul id="ul_group">
	  			<li><a class="index" href="Javascript:void(0)">url</a></li>
	  			<li><a href="Javascript:void(0)">url1</a></li>
	  			<li><a href="Javascript:void(0)">url2</a></li>
	  			<li><a href="Javascript:void(0)">url3</a></li>
	  			<li><a href="Javascript:void(0)">url4</a></li>
	  			<li><a href="Javascript:void(0)">url5</a></li>
	  			<li><a href="Javascript:void(0)">url6</a></li>
	  		</ul>
	  </div>
	  <div data-role="content" style="width:60%;margin:auto">
	  		
		    <form action="Javascript:void(0)" id="form_page">
				  <label >产品链接:</label>
				  <input type="text" name="proUrl" disabled="disabled" />
				  <label >标题:</label>
				  <input type="text" name="tit" disabled="disabled" />
				  <label >描述:</label>
				  <textarea type="text"  name="dec" disabled="disabled"></textarea>
				  <label >分享图片:</label>
				  <input type="text" name="img" disabled="disabled" />
				  <label >分享链接:</label>
				  <input type="text" name="shareUrl" disabled="disabled" />
			</form>
	  </div>
	  <div style="width:15%;;background:#e9e9e9;position:absolute;right:0;height:95%;top:44px;padding:0 10px;">
	  			<button id="del" >删除</button>
				<button id="revise" >修改</button>
	  </div>
	  <script>

	  </script>
	<script>
		$("#ul_group a").click(function(){
			if(!$(this).hasClass("index")){
				$(this).addClass("index");
				$("#header h1").html("分享LIST-"+$(this).text());
				$(this).parent().siblings().find("a").removeClass("index");
			}
		})
	</script>

</div>
</body>
</html>